import { useState } from "react";
import BaseCard from "components/BaseCard";
import { gql, useMutation } from "@apollo/client";
import { TextField, Stack, Button } from "@mui/material";
import { useSession } from "next-auth/react";
import toast from "react-hot-toast";
const ADD_REVIEW = gql`
  mutation Mutation($addReviewId: Int!, $content: String!) {
    addReview(id: $addReviewId, content: $content) {
      id
    }
  }
`;

const CommentAddReview = ({ id }) => {
  const [review, setReview] = useState("");

  const [addReview, { data: d }] = useMutation(ADD_REVIEW);
  const { data: session } = useSession();
  const handleChange = (e) => {
    setReview(e.target.value);
  };
  const sendHandle = () => {
    console.log(review);
    if (review.length > 0)
      toast
        .promise(
          addReview({
            variables: {
              addReviewId: id,
              content: review,
            },
          }),
          {
            loading: "正在发送",
            success: "发送成功",
            error: (err) => `发送失败 ${err}`,
          }
        )
        .then(() => {
          location.reload();
        });
    else toast.error("评论内容不能为空！");
  };
  return (
    <Stack direction="row" spacing={1}>
      <TextField onChange={handleChange} label="回复" fullWidth />
      <Button
        disabled={session?.user == undefined}
        onClick={sendHandle}
        variant="contained"
      >
        发送
      </Button>
    </Stack>
  );
};

export default CommentAddReview;
